import React from 'react';
// import PubSub from 'pubsub-js'
import { Button ,Upload } from 'antd';
import 'antd/dist/antd.css'
import { UploadOutlined} from '@ant-design/icons';
// import reqwest from 'reqwest';

export default class Demo extends React.Component {
  constructor(props){
   super(props)
   const fileList=[]
  //  console.log(props);
   props.url.map((i,index,arr)=>{
    fileList[index]={
      uid: i,
      name: i,
      status: 'done',
      url: i,
    }
   })
   this.state={
    fileList:fileList
   }
}
  state = {
    fileList: [],
    uploading: false,
  };
  handleUpload = () => {
    const { fileList } = this.state;
    // let formData=new FormData
    // fileList.forEach(file => {
    //   formData.append('files', file);
    // });

    // this.setState({
    //   uploading: true,
    // });

    // You can use any AJAX library you like
    // reqwest({
    //   url: 'https://www.mocky.io/v2/5cc8019d300000980a055e76',
    //   method: 'post',
    //   processData: false,
    //   data: formData,
    //   success: () => {
    //     this.setState({
    //       fileList: [],
    //       uploading: false,
    //     });
    //     message.success('upload successfully.');
    //   },
    //   error: () => {
    //     this.setState({
    //       uploading: false,
    //     });
    //     message.error('upload failed.');
    //   },
    // });
  };
  componentDidMount(){
    this.props.a(this.state.fileList)
  }
  render() {
    const { uploading, fileList } = this.state;
    // console.log(fileList);
    let {a}=this.props
    const props = {
      onChange:e=>{
          if (!e.file.status) {
            a(fileList)
          }
        },
      onRemove: file => {
          this.setState(state => {
          const index = state.fileList.indexOf(file);
          const newFileList = state.fileList.slice();
          newFileList.splice(index, 1);

          return {
            fileList: newFileList,
          };
        },()=>{
            a(this.state.fileList)
        });
      },
      beforeUpload: (file,fileList) => {
        this.setState(state => ({
          fileList: [...state.fileList, file],
        }));
        return false;
      },
      
      fileList,
    };
    // console.log(fileList,this.props.url);
    return (
      <>
        <Upload {...props}>
          <Button   onClick={this.handleUpload} icon={<UploadOutlined />}>上传</Button>
        </Upload>
      </>
    );
  }
}
